﻿@model DTO.Article
@{
    ViewData["Title"] = "Kindeditor";
    Layout = "~/Views/Share/_Layout.cshtml";
}

<link rel="stylesheet" href="~/Lib/Kindeditor/themes/default/default.css" />
<link rel="stylesheet" href="~/Lib/Kindeditor/plugins/code/prettify.css" />
<script charset="utf-8" src="~/Lib/Kindeditor/kindeditor-all.js"></script>
<script charset="utf-8" src="~/Lib/Kindeditor/lang/zh-CN.js"></script>
<script charset="utf-8" src="~/Lib/Kindeditor/plugins/code/prettify.js"></script>
<link href="~/Lib/Markdown/css/Note.css?v=2" rel="stylesheet" />
<script>
     KindEditor.ready(function (K) {
        window.editor = K.create('#MyEidtor', {
            uploadJson: '../../Editor/KindSaveFiles?Title=@Html.Raw(Model.Title)&ContextId=@Model.Id',
            fileManagerJson: '@Url.Action("KindFileManager", "Editor")',
            allowFileManager: true,
            autoHeightMode : true,
                    afterCreate: function () {
                        var editerDoc = this.edit.doc;//得到编辑器的文档对象
                        //监听粘贴事件, 包括右键粘贴和ctrl+v
                        $(editerDoc).bind('paste', null, function (e) {
                            var ele = e.originalEvent.clipboardData.items;
                            for (var i = 0; i < ele.length; ++i) {
                                //判断文件类型
                                if (ele[i].kind == 'file' && ele[i].type.indexOf('image/') !== -1) {
                                    var file = ele[i].getAsFile();//得到二进制数据
                                    //创建表单对象，建立name=value的表单数据。
                                    var formData = new FormData();
                                    formData.append("imgFile", file);//name,value

                                    //用jquery Ajax 上传二进制数据
                                    $.ajax({
                                        url: '../../Editor/KindSaveFiles?dir=image&Title=@Html.Raw(Model.Title)&ContextId=@Model.Id',
                                        type: 'POST',
                                        data: formData,
                                        // 告诉jQuery不要去处理发送的数据
                                        processData: false,
                                        // 告诉jQuery不要去设置Content-Type请求头
                                        contentType: false,
                                        dataType: "json",
                                        beforeSend: function () {
                                            //console.log("正在进行，请稍候");
                                        },
                                        success: function (responseStr) {
                                            //上传完之后，生成图片标签回显图片，假定服务器返回url。
                                            var src = responseStr.url;
                                            var imgTag = "<img src='" + src + "' border='0'/>";

                                            //console.info(imgTag);
                                            //kindeditor提供了一个在焦点位置插入HTML的函数，调用此函数即可。
                                            editor.insertHtml(imgTag);


                                        },
                                        error: function (responseStr) {
                                            console.log("error");
                                        }
                                    });

                                }

                            }
                        }
                        )
                    }

        });
     });

    $(function () {
        $("#get-kd-btn").bind('click', function () {
        btnSave();
        });

           $("#back-last").bind('click', function () {
               window.close();
           });
    });


    function btnSave() {
        alert(window.editor.html());//获取了数据，保存就没问题了吧！
    }

</script>
<div id="layout">
    <div style="margin:auto;text-align:center;">
        <button class="btn" id="get-kd-btn">保存</button>
        <button class="btn" id="back-last">关闭</button><br />
    </div>
    <br /><br />
    <textarea name="content" style="width:100%;height:450px;" id="MyEidtor">@Html.Raw(Model.Context)</textarea>
</div>

